<template>
  <el-dropdown v-if="devMode" @command="executeCommand">
    <span>
      <span>{{prop.name}}</span>
    </span>
    <el-dropdown-menu slot="dropdown">
      <el-dropdown-item command="configProperty"><span class="el-icon-setting"></span> 配置属性</el-dropdown-item>
      <el-dropdown-item command="cloneProperty"><span class="el-icon-document-copy"></span> 克隆属性</el-dropdown-item>
      <el-dropdown-item command="deleteProperty" style="color: #F56C6C"><span class="el-icon-delete"></span> 删除属性</el-dropdown-item>
      <el-dropdown-item v-if="getRelatedCruds().length > 0" disabled><span class="el-icon-s-tools"/> 关联CRUD</el-dropdown-item>
      <template v-for="crud in getRelatedCruds()">
        <el-dropdown-item :command="{name: 'showRelatedCrud', crud}"><span class="el-icon-setting dropdown-item2"/>{{' ' + crud}}</el-dropdown-item>
      </template>
    </el-dropdown-menu>
    <el-dialog :visible.sync="openConfig"  width="1200px" append-to-body v-if="openConfig">
      <template slot="title">
        配置属性<el-tag>{{prop.name}}</el-tag>
      </template>
      <rva-tcrud appId="tcrud2_rva_viewproperty" :requestParams="{rvaAppParams: prop}" @rva-button-click="handleFormButtonClick"></rva-tcrud>
    </el-dialog>
    <el-dialog :visible.sync="openClone" width="900px" append-to-body v-if="openClone">
      <template slot="title">
        克隆属性<el-tag>{{prop.name}}</el-tag>
      </template>
      <rva-form viewId="c8_rva_viewproperty" :requestParams="{rvaAppParams: prop}" @rva-button-click="handleFormButtonClick"
      ></rva-form>
    </el-dialog>
    <el-dialog :visible.sync="openRelatedCrud"  width="900px" append-to-body v-if="openRelatedCrud">
      <template slot="title">
        显示<el-tag>{{prop.name}}</el-tag>的关联CRUD
      </template>
      <rva-crud :appId="currentRelatedCrud" :requestParams="{rvaAppParams: prop}"></rva-crud>
    </el-dialog>
  </el-dropdown>
  <span v-else>{{prop.name}}</span>
</template>

<script>

import config from '@/api/rva/config'
import {RvaUtils} from '@/api/rva/util';
export default {
  mixins: [config],
  data() {
    return {
      currentRelatedCrud: '',
      openRelatedCrud: false
    }
  },
  methods: {
    closeView () {
      this.openConfig = false
      this.openClone = false
      this.openRelatedCrud = false
    },
    getRelatedCruds () {
      if (RvaUtils.isEmpty(this.prop.formRelatedCrud)) {
        return [];
      }
      return this.prop.formRelatedCrud.split(',');
    },
    showRelatedCrud(command) {
      this.currentRelatedCrud = command.crud;
      this.openRelatedCrud = true;
    },
  }
};
</script>

<style>
.dropdown-item2 {
  margin-left: 20px
}
</style>
